<style type="text/css">
    .table-madan tr td{background-color: #ffffff;}
    .pihao th{background-color: #ffffff;border-bottom: 2px solid #efefef;}
    .pihao th span{padding: 5px 10px 4px 10px; background-color: #efefef;width: 130px; overflow: visible;font-weight: bold;display:inline-block;font-size: 14px;}
    .product-buy-quantity{*zoom:1;display: list-item;margin-bottom: .6em;text-align: -webkit-match-parent;list-style: none;}
    .item-content{display:block;margin-left:0.2em}
    .p-quantity-ph{display:inline-block;width:100px;overflow:hidden;vertical-align:middle}
    .p-quantity-ph input{width:40px;height:21px;line-height:21px;padding:0;margin:0;vertical-align:middle;border-width:1px 0;border-style:solid;border-color:#a9a9a9;text-align:center;border:1px solid #a9a9a9;border-right:0px;}
    .p-quantity-ph a{display:inline-block;width:56px;height:21px;overflow:hidden;vertical-align:middle;border:1px solid #a9a9a9;text-align:center;font:11px/11px Arial;line-height:21px;background-color:#fff;text-decoration:none;}
    .p-quantity-ph a:hover{background-color:#FC520A;color:#fff;border:1px solid #FC520A;text-decoration:none;}
    a { text-decoration: none; color: #666666; }
</style>
<div class="change-payment" >
    <div style="overflow:auto;height:500px;width:100%;">
        <table class="table-madan">
            <tbody>
            <{if $rolls|count gt 0}>
             <input type="hidden" id="goods[product]" value='<{$product_id}>'>
            <{foreach from=$rolls item=item key=key}>
            <input type = "hidden" id = "productId" value = "<{$item[0][0]['productId']}>" name = "productId">
               <tr class="pihao">
                  <th colspan=3>
                    <span><{$key}></span>
                    </th>
                </tr>
                    <{foreach from=$item item=_item}>
                     <tr>
                        <{foreach from=$_item item=it}>
                            <td> 
                            <input type="checkbox" name="chkRoll[]" value='<{$it['id']}>' cnt='<{$it['cntMi']}>' id="chkRoll[<{$it['id']}>]" class="chkRoll" >
                                <label for="chkRoll[<{$it['id']}>]" ><{$it['rollNo']}>#-<{$it['cnt']}><{$it['unit']}>
                                </label>
                            </td>
                        <{/foreach}>  
                    </tr>  
                    <{/foreach}>     
            <{/foreach}>
            <{else}>
                <tr >
                  <th colspan=3>
                    <label><b style='font-size:15px;'>未发现码单信息！请重新选择</b></label>
                    </th>
                </tr>
            <{/if}>            
            </tbody>
        </table>
    </div>
    <table>
        <tfoot>
            <tr>
                <th colspan="2">
                <li class = 'product-buy-quantity'><span class = "item-content">数量：<span class = "p-quantity-ph"><input type = 'text' id = 'cntM'><a href="javascript:autoPeihuo();" class="btn-peihuo">自动配货</a></span>
                </span></li>
                </th>
            </tr>
            <tr>
                <th colspan="2">
                <button type="button" class="btn btn-caution btnSure"><span><span>确认配货</span></span></button>
                <span class="label" id='divTotal'></span>
                </th>
            </tr>
        </tfoot>
    </table>

</div>
<script type="text/javascript">
    //每次选中，会重新计算总卷数和总米数
    //1Y = 0.9144M,ec端只考虑米数
    $$('.chkRoll').addEvent('click',function(e){
        var sign = 0;
        var totalCnt=0;
        var cnt=0;
        var ids= [];
        var inputs = document.getElementsByName('chkRoll[]');//获取所有的input标签对象。
        for(var i=0;i<inputs.length;i++){
            var obj = inputs[i];
            if(obj.type=='checkbox'){
                if(obj.checked==true){
                    sign++;
                    id = obj.value;
                    cnt = parseFloat(obj.getAttribute("cnt"))||0;
                    totalCnt=parseFloat(totalCnt)+cnt;
                    ids.push(id);
                }
            } 
        }
        totalCnt=parseFloat(totalCnt).toFixed(2);
        //往选中之中填值 
        //合计显示在页面上
        var totalStr="<b>选中:"+"<font color='red'>"+sign+"</font>&nbsp;&nbsp;卷&nbsp;&nbsp;共:"+"<font color='red'>"+totalCnt+"</font>&nbsp;&nbsp;M</b> <div type='hidden' id='total' value='"+totalCnt+"' cntJuan='"+sign+"' madan_ids='"+ids+"'></div> ";
        var spanDiv=window.document.getElementById ("divTotal");
        spanDiv.innerHTML = totalStr;
    });

    //2015-9-11 by jeff确认后,ajax访问后台，修改购物车数据后，动态改变当前页面的相关数据
    //包括数量和卷数
    $$('.btnSure').addEvent('click',function(e){
        //往数据库里面填写
        var product_id=window.document.getElementById('goods[product]').value;
        var inputCnt = $$('[name="goodsnum['+product_id+']"');
        var inputIds = $$('[name="goodsmadan_ids['+product_id+']"]');
        var inputJu = $$('[name="goodsjuanshu['+product_id+']"]');
        var inputPei = $$('[name="goodsPei['+product_id+']"]');
        var inputCl = $$('[name="goodsClient['+product_id+']"]');
        inputCnt.set('value',window.document.getElementById("total").getAttribute('value'));
        inputIds.set('value',window.document.getElementById("total").getAttribute('madan_ids'));
        inputJu.set('value',window.document.getElementById("total").getAttribute('cntJuan'));
        inputPei.set('value','');
        inputCl.set('value','');
        closeDiv();
        // alert('ajax访问后台，修改购物车数据后，刷新当前页面或者动态改变当前页面的某些区域的数据');
        
    });

    /**
     * ps ：ec后台自动配货
     * Time：2015/10/27 12:51:15
     * @author liuxin
    */
    function autoPeihuo(){
        var inputs = document.getElementsByName('chkRoll[]');//获取所有的input标签对象。
        for(var i=0;i<inputs.length;i++){
        var obj = inputs[i];
            if(obj.type=='checkbox'){
                if(obj.checked==true){
                    obj.checked = false;
                }
            } 
        }
        
        var id = document.getElementById("productId").value;
        var cntM = document.getElementById("cntM").value;
        if(isNaN(Number(cntM))||cntM == ''||cntM <= 0){
            document.getElementById("cntM").value = "0";
            var totalStr="<b>选中:"+"<font color='red'>"+"0"+"</font>&nbsp;&nbsp;卷&nbsp;&nbsp;共:"+"<font color='red'>"+"0"+"</font>&nbsp;&nbsp;M</b> <div type='hidden' id='total' value='"+"0"+"' cntJuan='"+"0"+"' madan_ids='"+""+"'></div> ";
            var spanDiv=window.document.getElementById ("divTotal");
            spanDiv.innerHTML = totalStr;
            return;
        }
        var url = "<{link app=b2c ctl=site_order act=autoPeihuo}>";
        new Request({
            method: 'post',
            url:url,
            data:{'product_id':id,'cntM':cntM},
            onSuccess:function(rs){
                try{
                        rs = JSON.decode(rs);
                        if(rs.error) {
                            return Message.error(rs.error);
                        }
                    }catch(e) {
                        updateBasic(rs, id, url,atext);
                    }
                if(rs.data.length==0){
                    alert("配货失败,请检查填入数量是否正确！");
                    return;
                }

                for(var i=0;i<rs.data.length;i++){
                    $$("[id='chkRoll["+rs.data[i]+"]']").set('checked','checked');
                }

                var sign = 0;
                var totalCnt=0;
                var cnt=0;
                var ids= [];
                for(var i=0;i<inputs.length;i++){
                var obj = inputs[i];
                    if(obj.type=='checkbox'){
                        if(obj.checked==true){
                            sign++;
                            id = obj.value;
                            cnt = parseFloat(obj.getAttribute("cnt"))||0;
                            totalCnt=parseFloat(totalCnt)+cnt;
                            totalCnt=totalCnt.toFixed(3);
                            ids.push(id);
                        }
                    } 
                }
                totalCnt=parseFloat(totalCnt).toFixed(2);
                document.getElementById("cntM").value = totalCnt;
                //往选中之中填值 
                //合计显示在页面上
                var totalStr="<b>选中:"+"<font color='red'>"+sign+"</font>&nbsp;&nbsp;卷&nbsp;&nbsp;共:"+"<font color='red'>"+totalCnt+"</font>&nbsp;&nbsp;M</b> <div type='hidden' id='total' value='"+totalCnt+"' cntJuan='"+sign+"' madan_ids='"+ids+"'></div> ";
                var spanDiv=window.document.getElementById ("divTotal");
                spanDiv.innerHTML = totalStr;
            }
        }).post();
    }
</script>
